<template>
  <div id="app">
      <router-view></router-view>
      <el-dialog title="提示" v-model="modal.showModal" size="tiny">
        <span>{{modal.modalContent}}</span>
        <span slot="footer" class="dialog-footer">
            <el-button @click="closeModal">取 消</el-button>
            <el-button type="primary" @click="closeModal">确 定</el-button>
        </span>
      </el-dialog>
  </div>
</template>

<script>
    import './assets/js/bootstrap.js'
    import './assets/js/app.js'
    import './assets/js/bootstrap-table.min.js'
    import './assets/js/bootstrap-table-zh-CN.min.js'
    import './assets/js/echarts.min.js'
    import './assets/js/jquery-jtemplates.js'
    import myWrapper from './components/Wrapper'
    import myLogin from './components/Login'
    import Projects from './components/Projects'
    export default {
        name: 'app',
        data(){
            return{
                // modalContent:'连接错误',
                // dialogVisible:false,
            }
        },
        components: {
            myWrapper,
            myLogin,
            Projects
        },
        computed:{
            modal(){
                return this.$store.state.modal
            }
        },
        methods:{
            closeModal(){
                this.$store.commit('closeModal')
            }
        }
    }
</script>

<style>
    @import './assets/css/bootstrap.css';
    @import './assets/css/AdminLTE.css';
    @import './assets/css/font-awesome.css';
    @import './assets/css/bootstrap-table.min.css';
    #app {
        font-family: 'Avenir', Helvetica, Arial, sans-serif;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        text-align: center;
    }
</style>